<!--  -->
<template>
  <div>
    <ul class="list">
        <li class="item"
        v-for="(item , key) of cities"
        :key="key"
        >
        {{key}}</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'CityAlphabet',
  props: {
    cities: Object
  },
  data () {
    return {
    }
  },

  components: {},

  computed: {},

  methods: {}
}

</script>
<style lang='stylus' scoped>
  @import "~styles/varibles.styl"
  .list
    display : flex /* 设置垂直方向上居中 */
    flex-direction : column /* 设置垂直方向上居中 */
    justify-content : center /* 设置垂直方向上居中 */
    position: absolute
    right: 0
    top : 1.58rem
    bottom: 0
    width : .4rem
    .item
      text-align : center
      line-height : .4rem
      color : $bgcolor
</style>
